<%--
  Created by IntelliJ IDEA.
  User: wuq
  Date: 2018/9/18
  Time: 14:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>定位</title>
    <style>
        .borderred {/*显示框*/
            border-style: solid;
            border-width: thin;
            border-color: red;
            margin: 20px 20px 20px 0px;
        }
        .bordergreen {
            border-style: solid;
            border-width: medium;
            border-color: green;
        }
        #absolute{
            position:absolute;
            left: 30px;
            top: 20px;
        }
        #absolute2{
            position:absolute;
            left: 30px;
            top: 20px;
        }
    </style>
</head>
<body>
<div class="borderred">
    我是块级元素
</div>

<strong class="bordergreen">我是行内元素</strong>

<div class="bordergreen" id="absolute">
    绝对定位
</div>
<div class="bordergreen" id="absolute2">
    绝对定位2
</div>
<div class="bordergreen">
    我在绝对定位下面
</div>
</body>
</html>
